<lv-treetable [lvData]="data" #lvTable lvVirtualScroll [lvScroll]="{ y: '400px' }" lvVirtualMinBuffer="96px" [lvVirtualTrackBy]="trackByIndex">
  <thead>
  <tr>
    <th lvCellKey="name">Name</th>
    <th lvCellKey="age">Age</th>
    <th lvCellKey="random">Random</th>
  </tr>
  </thead>
  <tbody>
  <ng-template lv-virtual-scroll let-item>
    <ng-container *ngTemplateOutlet="contentTpl; context: { $implicit: item, level: 0 }"> </ng-container>
  </ng-template>

  <!-- template -->
  <ng-template #bodyContentTpl let-data let-level="level">
    <ng-container *ngFor="let item of data">
      <ng-container *ngTemplateOutlet="contentTpl; context: { $implicit: item, level: level }"></ng-container>
    </ng-container>
  </ng-template>

  <ng-template #contentTpl let-item let-level="level">
    <tr>
      <td [lvShowExpanded]="item.children?.length" [(lvExpanded)]="item.expanded" [lvPaddingLeft]="level * 24 + 'px'">
        {{ item.data.name }}
      </td>
      <td>{{ item.data.age }}</td>
      <td>{{ item.data.random }}</td>
    </tr>
    <ng-container *ngIf="item.expanded && item.children?.length">
      <ng-container *ngTemplateOutlet="bodyContentTpl; context: { $implicit: item.children, level: level + 1 }"></ng-container>
    </ng-container>
  </ng-template>
  </tbody>
</lv-treetable>
